<?php if(!defined('IN_FIRADIO')) {header('HTTP/1.1 403 Forbidden');exit('<h1>Access Denied</h1>');}?>
<?php $GLOBALS['script'][] = function() {?><script>
vue.data.form = null;
vue.data.disabled = false;
vue.data.api_recordcount = {};
vue.data.api_recordcount.selects = {};
vue.methods.submit_recordcount = function () {
    const that = this;
    //that.disabled = true;
    that.ApiPost('/panel/ip/recordcount.php', that.form).then(function (data) {
        vue.data.api_recordcount = data.data;
        const selects = data.data.selects;
        if (vue.data.form === null) {
            vue.data.form = {};
            for (var key in selects) {
                vue.data.form[key] = '';
            }
        }
    }, function (data) {
        console.log('reject:', data);
    }).catch(function (reason) {
        console.log('catch:', reason);
    })
};
vue.methods.micro_to_second = function (ms) {
    var a = (ms / 1000);
    a = Math.round(a * 100) / 100;
    return a;
};
vue.mounted = function () {
    vue.methods.submit_recordcount();
};
</script><?php }?>

<!-- Custom Tabs -->
<form v-on:submit="submit_recordcount" onsubmit="return false" :disabled="disabled">
<div class="nav-tabs-custom">

    <label style="margin: 10px;" v-for="(select,key) in api_recordcount.selects">
        {{select.title}}:<select v-model="form[key]" v-on:change="submit_recordcount">
        <option value="">(全部)</option>
        <option v-for="(count,name) in select.options" :value="name">{{name}}({{count}})</option>
    </select></label>
    记录总数：{{api_recordcount.sumrecords}}条

    <div v-if="0" v-for="row in api_recordcount.rows">
        <input :value="row.ipaddr+':'+row.ipport" style="width: 100%" readonly /><br />
    </div>

    <table class="table table-bordered table-striped dataTable">
        <tr align="center">
            <td width="">来源名称</td>
            <td width="">IP地址</td>
            <td width="">端口号</td>
            <td width="">所属国家</td>
            <td width="">所属省份</td>
            <td width="">所属地级</td>
            <td width="">ISP</td>
            <td width="">其他</td>
            <td width="">握手</td>
            <td width="">HTTPS</td>
        </tr>
        <tr v-for="row in api_recordcount.rows" align="center">
            <td>{{row.title?row.title:row.proxyurl_id}}</td>
            <td>{{row.ipaddr}}</td>
            <td>{{row.ipport}}</td>
            <td>{{row.area_level1}}</td>
            <td>{{row.area_level2}}</td>
            <td>{{row.area_level3}}</td>
            <td>{{row.isp}}</td>
            <td>{{row.other}}</td>
            <td><span v-if="row.tcp_usetime">{{micro_to_second(row.tcp_usetime)}}</span><span v-else>-</span></td>
            <td><span v-if="row.http_usetime">{{micro_to_second(row.http_usetime)}}</span><span v-else>-</span></td>
        </tr>
    </table>
</div>
</form>
